<template>
	<div>
			   
	   <div class="noData" v-if="showNoData">
	   	<img src="../../../../static/img/lanhu/noData.png" alt="" />
	   </div>
	   
	   
		<van-pull-refresh v-model="refreshing" @refresh="onRefresh" :style="{ 'min-height': clientHeight + 'px' }">
		  <van-list
		    v-model="loading"
		    :finished="finished"
		    :finished-text="finishedText"
		    @load="onLoad"
		    :immediate-check="false"
		  >	  
		  
		  <van-swipe-cell v-for="(item,index) in list" :key="index" >
		        <div class="b">	         
		          <div class="c">
		          	<img :src="item.avatar" alt="" class="img"  v-if="item.avatar"/>
		          	<img src="../../../../static/img/lanhu/45.png" alt="" class="img"  v-else/>
		          </div>
		          <div class="d">
		          	 <div class="e">
		          	 	<div class="e1">{{item.title}}</div>
		          	 	<div class="e2">{{item.content}}</div>
		          	 	<div class="e3">{{timeago(item.addtime)}}</div>
		          	 </div>
		          	 <div class="f" :style="{backgroundImage: 'url(' + item.goodsImage + ')'}" @click="linkDetail(item)">
	
		          	 </div>
		          </div>        
		        </div>			  
			  <template #right>
			    <van-button square type="danger" text="删除" />
			  </template>
          </van-swipe-cell>
		  
		  
		  
	        <!--<div class="b" v-for="(item,index) in list" :key="index">	         
	          <div class="c">
	          	<img :src="item.avatar" alt="" class="img"  v-if="item.avatar"/>
	          	<img src="../../../../static/img/lanhu/45.png" alt="" class="img"  v-else/>
	          </div>
	          <div class="d">
	          	 <div class="e">
	          	 	<div class="e1">{{item.title}}</div>
	          	 	<div class="e2">{{item.content}}</div>
	          	 	<div class="e3">{{timeago(item.addtime)}}</div>
	          	 </div>
	          	 <div class="f" :style="{backgroundImage: 'url(' + item.goodsImage + ')'}" @click="linkDetail(item)">

	          	 </div>
	          </div>        
	        </div>	  -->
		  </van-list>
		</van-pull-refresh> 		   
	</div>	
</template>
<script>
import '@/assets/reset/interaction.css'
import {getFun} from '@/api/publicFun.js'	 
let publicFun=getFun()	
export default {	
	data() {
       return {
       	  loading: false,    // 是否处于数据加载状态 
	      finished: false,   // 是否处于数据最底部的状态 
	      refreshing: false, // 是否处于下拉刷新状态         
          pageNum:1,         // 当前数据的页码数
          pages:0,           // 储存数据的最大页码数
          list:[],            // 储存数据用
          finishedText:'',
          showNoData:false,// 是否显示暂无数据
          url1:this.$api+'/marketorderservice/api/v1/market/selectInformationList'
       }
	},
	methods: {	
		// 跳转到商品详情页
		linkDetail(item){
		  let arg='[{"comId":"'+item.comId+'"}]' 
		  this.linkGoodsDetail(this.userId,item.suserId,arg)
		},			
        // 获取数据
        getData(){
	   	    let that=this
		    this.$Axios2.postRequest(this.url1,{userId:this.userId,noticeType:'3'},{pageNum:this.pageNum,pageSize:'10'})
		    .then(function(res) {
			  	if(res.data.page.total==0){
			  		that.showNoData=true
			  	}
		    	that.pages=res.data.page.pages
	            that.list=that.list.concat(res.data.page.records)
		    })       	
        },
	    // 上拉加载函数
	    onLoad(){	   	 
		 setTimeout(() => {		 	
	        if (this.refreshing) {
	          this.list = [];
	          this.refreshing = false;
	        }	        
	        this.pageNum++
	        if(this.pageNum>this.pages){this.finished = true;}
	        else{
              this.getData()
	          this.loading = false;	    
	          this.finishedText='我也是有底线的'
	        }
	      }, 1000);   	
	    },
	    // 下拉刷新函数	
	    onRefresh() {
		  setTimeout(() => {
	          this.pageNum=1
	          this.list=[]
	          this.getData()	
	          this.finished = false;
	          this.loading=false
			  this.refreshing = false;
		  }, 1000);          
	   },	    
	},
	mixins:[publicFun],//混入		
	mounted() {
		this.getData()
	}
}	
</script>

<style scoped="" lang="scss">
.van-swipe-cell__right{padding-top: 0;}
.b.active{background: #fcf6db}
.b{display: flex;padding: 10px 0 10px 10px;background: #fff;}
.c{padding-right: 10px;position: relative;}
.img{height: 40px;width: 40px;display: block;border-radius: 5px;}
.d{flex: 1;padding-right: 10px;display: flex;}
.e{flex: 1;display: flex;flex-direction: column;justify-content: space-between;}
.e1{font-size: 13px;font-weight: bold;}
.e2{color: $common-color3;}
.e3{color: $common-color3;}
.f{height:60px;width: 60px;overflow: hidden;background-repeat: no-repeat;background-size:cover;background-position: 50% 50%;border-radius: 4px;}
/*.img1{height:60px;width: 60px;display: block}*/
.g{height: 6px;width: 6px;border-radius: 50%;right: 10px;
background: $common-color4;position: absolute;top: -3px;}
.spot{position: absolute;width: 6px;height: 6px;border-radius: 50%;background: red;top: -3px;right: 8px;}

</style>